<!-- subpkg_consult/department/index.vue -->
<script lang="ts" setup>
  import { departmentListApi } from '@/apis/consult'
  import type { DepartData } from '@/types/consult'
  import { onLoad } from '@dcloudio/uni-app'
  import { ref } from 'vue'

  const list = ref<DepartData[]>([])

  const getList = async () => {
    const res = await departmentListApi()
    // console.log(res)
    list.value = res
  }
  onLoad(() => {
    getList()
  })

  const currentIndex = ref(0)

  // 获取页面路径中的参数
  const props = defineProps<{ illnessType: string; type: string }>()
  console.log(props)
</script>

<template>
  <view class="department-page">
    <!-- 左边大科室 -->
    <scroll-view scroll-y class="department-primary">
      <view
        v-for="(item, index) in list"
        :key="item.id"
        class="department-item"
        :class="{ active: currentIndex === index }"
        @click="currentIndex = index"
      >
        {{ item.name }}
      </view>
    </scroll-view>

    <!-- 右侧 子科室 list[currentIndex].child -->
    <scroll-view class="department-secondary">
      <navigator
        v-for="sub in list[currentIndex]?.child"
        :key="sub.id"
        hover-class="none"
        :url="`/subpkg_consult/description/index?depId=${sub.id}&type=${props.type}&illnessType=${props.illnessType}`"
        class="department-item"
      >
        {{ sub.name }}
      </navigator>
    </scroll-view>
  </view>
</template>

<style lang="scss">
  @import './index.scss';
</style>
